let goodsDom = $('.container tbody');
let str1='';
let oldGoods = []
let goods = []

$(function () {
    $.get('./goods.json', function(res){
        for(let item of res){
            item.num = 1
            str1 += `
                <tr>
                    <td>
                        <input class="one form-check-input" value="${ item.id }" type="checkbox" onchange="selectOne(this)">
                    </td>
                    <td class="goodsName">${ item.goodsName }</td>
                    <td class="price">${ item.price }</td>
                    <td>
                        <div class="input-group input-group-sm">
                            <span class="input-group-btn">
                               <button class="btn btn-primary btn-sm" type="button" onclick="minus(this, ${ item.id })">-</button>
                            </span>
                            <input class="form-control text-center" id="num" value="${ item.num }" min="1" style="width: 30px;" type="number" name="num" placeholder="请输入购买商品数量" onchange="numChange(this, ${ item.id })">
                            <span class="input-group-btn">
                               <button class="btn btn-primary btn-sm" type="button" onclick="plus(this, ${ item.id })">+</button>
                            </span>
                        </div>
                    </td>
                </tr>   
            `
        }
        oldGoods = res
        goodsDom.append(str1);
    })
});

/**
 * 单选
 * @param event
 */
function selectOne(event){
    if(event.checked){
        oldGoods.forEach(item => {
            if(item.id == event.value){
                goods.push(item)
            }
        })
    }else{
        goods = goods.filter(item => item.id != event.value)
    }
}

/**
 * 全选
 * @param event
 */
function selectAll(event) {
    $('.one').prop("checked", event.checked)
    goods = []
    if($('.one').is(":checked")){
        $('.one').each(index =>{
            const id = $('.one').eq(index).val()
            const arr = oldGoods.filter(item => item.id == id)
            goods.push(...arr)
        })
    }
    console.log(goods)
}

/**
 * 数字输入框事件
 * @param event
 * @param id
 */
function numChange(event, id) {
    const num = event.value
    oldGoods = oldGoods.map(item => {
        if(item.id == id){
            item.num = num
        }
        return item
    })
}

/**
 * 数量减
 * @param button
 * @param id
 */
function minus(button, id) {
    let input = button.closest(".input-group-btn").nextElementSibling;
    let num = parseInt(input.value);
    if (num > 1) {
        input.value = num - 1
    }
}

/**
 * 数量加
 * @param button
 * @param id
 */
function plus(button, id) {
    let input = button.closest(".input-group-btn").previousElementSibling
    let num = parseInt(input.value);
    input.value = num + 1
}

/**
 * 加入购物车
 */
function buy(){
        if(goods.length > 0){
            if(goods.some(item => !item.num || item.num == 0)){
                alert("请输入购买数量")
                return;
            }
            $.ajax({
                url:'/shop',
                type:"post",
                // traditional: true,//属性在这里设置
                data:{
                    goods: JSON.stringify(goods)
                    // goods
                },
                success:function(res){
                    console.log(res)
                    //跳转页面
                    window.location.href = "./goods.jsp"
                },
                error:function (err) {
                    console.log(err)
                }
            })
        }else{
            // 未选中
            alert("请选择商品")
        }
}